﻿<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title>社团管理系统登录</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">    
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link href="bootstrap/bootstrap-3.3.5/css/bootstrap.min.css" rel="stylesheet" media="screen">
<script src="bootstrap/jquery.min.js" type="text/javascript"></script>
<script src="bootstrap/layer-v3.1.1/layer.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript"> 
	
</script>
<style type="text/css">
 body,td,div
 {
   font-size:12px;
 }
 html,body{
 	margin:0px;
 	padding:0px;
 	height:100%;
 }
 body{
 	background-image:url('images/login_bg2.jpg');
 	 background-repeat:no-repeat;
   filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale')";  
   background-size:100% 100%;
 }
</style>
</head>
<BODY style="">
<FORM id="info" name="info"  method="post" action="LoginInSystem.action">
<DIV id=UpdatePanel1 style="width:900px;margin:0 auto">
<TABLE cellSpacing=0 cellPadding=0 width=900 align=center border=0>
	<TBODY>
		<TR>
			<TD style="font-size:38px;font-family:'黑体';text-align:center;HEIGHT:105px;color:gold">
				社团管理系统后台登录
			</TD>
		</TR>
		<TR>
			<TD height=300>
			<TABLE height=300 cellPadding=0 width=900 border=0>
			<TBODY>
				<TR>
					<TD>
					<div class="panel panel-danger" style="background-color: rgba(255, 255, 255, .4);box-shadow: 0 4px 8px 10px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.19);width:400px;margin:0 auto;margin-top:5px;height:250px;-webkit-border-radius: 20px;-moz-border-radius: 20px;border-radius: 20px;">
					  <div class="panel-body" class="form-inline" style="padding-left:50px">
					  	<div class="form-group form-inline">
					  		<label for="user_name">用户名：</label>
					    	<INPUT type="text" class="form-control" id="user_name" name="user_name" value="${params.user_name}" style="WIDTH:230px" placeholder="输入账号"/>
					    </div>
					    <div class="form-group form-inline">
					    	<label for="user_name">密　码：</label>
					    	<INPUT type="password" class="form-control" id="user_pass" name="user_pass" value="${params.user_pass}" style="WIDTH:230px"  placeholder="输入密码"/>
					    </div>
					    <div class="form-group form-inline">
					    	<label for="user_name">验证码：</label>
					    	<INPUT type="text" class="form-control" id="random" name="random" style="WIDTH: 110px"  placeholder="输入验证码"/>
					    	<img src="Random.jsp" width="70" height="25" valign="middle" style="cursor:pointer;vertical-align:middle" title="换一张" id="safecode" border="0" onClick="reloadcode()"/>
					    </div>
					    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
					    <input id="loginInBtn"  class="btn btn-success" type="button" value="登录系统">
					    &nbsp;&nbsp;&nbsp;&nbsp;<input class="btn btn-primary" type="reset" value="重 置">
					  </div>
					</div>
					</TD>
				</TR>
			</TBODY>
			</TABLE>
			</TD>
		</TR>


	</TBODY>
</TABLE>
</DIV>
</DIV>
</FORM>
<script language="javascript" type="text/javascript">
	//实现验证码点击刷新
	function reloadcode(){
		var verify=document.getElementById('safecode');
		verify.setAttribute('src','Random.jsp?'+Math.random());
	}

	$(document).ready(function(){
		var loginInBtn = $("#loginInBtn");
		var user_name = $("#user_name");
		var user_pass = $("#user_pass");
		var random = $("#random");
		var loginTip = $("#loginTip");
		
		loginInBtn.bind('click',function(){
			if(user_name.val()==''||user_pass.val()==''||random.val()==''){
				layer.alert("用户名、密码和验证码不能为空！",{skin: 'layui-layer-lan'})
				return;
			}
			$("#info").submit();
		});
		
		var tip = "${tip}";
		if(tip){
			layer.alert(tip,{skin: 'layui-layer-lan'})
		}
		
	});
</script>
</BODY>
</HTML>
